<template>
  <div class="page-wrap">
    <el-card shadow="never">
      <div class="toolbar">
        <el-button type="primary" @click="genPlan">生成补货建议</el-button>
        <el-button @click="applyPlan" :disabled="plan.length===0">一键补货(入库)</el-button>
      </div>
      <el-table :data="plan" border stripe>
        <el-table-column prop="code" label="编码" width="120" />
        <el-table-column prop="name" label="名称" min-width="160" />
        <el-table-column prop="quantity" label="当前库存" width="120" />
        <el-table-column prop="minStock" label="最低库存" width="120" />
        <el-table-column prop="suggest" label="建议补货" width="120" />
      </el-table>
    </el-card>
  </div>
</template>

<script setup>
import { ref } from 'vue'
import { useStockStore } from '@/stores/stock.js'
const stock = useStockStore()
const plan = ref([])

function genPlan(){
  if(!stock.stockList.length) stock.initializeStock()
  plan.value = stock.getWarningProducts().map(p=>({
    id: p.id,
    code: p.code,
    name: p.name,
    quantity: p.quantity,
    minStock: p.minStock,
    suggest: Math.max(0, (p.minStock||0) * 2 - (p.quantity||0)) || 0
  }))
}
function applyPlan(){
  const now = new Date().toISOString()
  plan.value.forEach(item=>{
    if(item.suggest>0){
      stock.inboundStock({ productId: item.id, quantity: item.suggest, price: (stock.stockList.find(x=>x.id===item.id)?.costPrice)||0, supplier: '补货', date: now, remark: '补货建议入库' })
    }
  })
  plan.value = []
}
</script>

<style scoped>
.page-wrap { padding: 16px; }
.toolbar { display: flex; gap: 12px; margin-bottom: 12px; }
</style>


